<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>钻石投票_添加选手</title>
    <link rel="stylesheet" href="__CSS__/font-awesome.css"/>
    <link rel="stylesheet" href="__JS__/layui/css/layui.css"/>
    <link rel="stylesheet" href="__MCSS__/bass.css"/>
    <link rel="stylesheet" href="__MCSS__/public.css"/>
    <link rel="stylesheet" href="__MCSS__/layui-add.css"/>
    <link rel="stylesheet" href="__MCSS__/add_player.css">

    <style>
        .edui-default .edui-colorpicker-nocolor{
            height: 21px !important;
        }
        #editor{width: 400px;height: 300px;}
        .add-player-img img{
            width: 100%;
            height: 100%;
            vertical-align: middle;
        }
    </style>
</head>
<body>
<form class="layui-form" action=""  method="post" enctype="multipart/form-data" onsubmit="return fun()">
<div class="add-player">
    <div class="add-player-body">
        <!--面包屑-->
        <p class="bread-crumbs-nav"><span class="span1">微活动</span><i class="fa fa-caret-right"></i><span class="span2">今日开始</span></p>

        <!-- 选手姓名 -->
        <div class="add-player-list">
            <p class="add-player-list-tit">选手姓名：</p>
            <input type="text" name="com[name]" required>
        </div>

        <!-- 选手手机号码 -->
        <div class="add-player-list">
            <p class="add-player-list-tit">选手手机号码：</p>
            <input type="text" name="com[tel]" lay-verify="phone">
        </div>
        <!-- 选手参赛宣言 -->
        <div class="add-player-list add-player-msg">
            <p class="add-player-list-tit">选手参赛宣言：</p>
            <div class="main">
                <textarea name="com[content]" placeholder="" class="layui-textarea"></textarea>
            </div>
            <div class="add-player-clear"></div>
        </div>
        <!-- 选手图片 -->
        <div class="add-player-list add-player-msg">
            <p class="add-player-list-tit">选手图片：</p>
            <p class="lcg-btn5 add-player-upload-btn"><input type="file" multiple="multiple" required><span>上传图片</span></p>
            <div class="add-player-clear"></div>
            <div class="add-player-container" style="display: none;">
            </div>
        </div>
        <!-- 票数 -->
        <div class="add-player-list">
            <p class="add-player-list-tit">票数：</p>
            <div class="main">
                <input type="text" name="com[fake_ticket_num]" value="0">
            </div>
        </div>
        <!-- 礼物 -->
        <div class="add-player-list">
            <p class="add-player-list-tit">礼物：</p>
            <div class="main">
                <input type="text" name="com[fake_money_num]" value="0">
            </div>
        </div>
        <!-- 虚拟热度 -->
        <div class="add-player-list">
            <p class="add-player-list-tit">虚拟热度：</p>
            <div class="main">
                <input type="text" name="com[fake_browse_num]" value="0">
            </div>
        </div>
        <!-- 选手介绍 -->
        <div class="add-player-list add-player-msg">
            <p class="add-player-list-tit">选手介绍：</p>
            <div class="add-player-word">
                <div class="prize-ueditor">
                    <script id="editor" name="config[introduce]"></script>
                </div>
            </div>
        </div>
        <!-- 审核通过 -->
        <div class="add-player-list" style="margin-top: 80px">
            <p class="add-player-list-tit">审核通过：</p>
            <div class="main1">
                    <input type="checkbox" name="com[is_audit]" lay-skin="switch" lay-text="已审核|未审核" value="1" lay-filter="switchTest" checked>
            </div>
            <p class="add-active-main-tips">审核通过后选手信息才会在前台显示</p>
        </div>
        <div class="add-player-btn">
            <div class="add-player-cancel">取消</div>
            <button type="submit"><div class="add-player-sure">保存</div></button>
        </div>

    </div>
</div>
</form>



</body>

<script src="__JS__/ueditor/ueditor.config.js"></script>
<script src="__JS__/ueditor/ueditor.all.js"></script>
<script src="__JS__/jquery_v3.3.1.js"></script>
<script src="__JS__/layer/layer.js"></script>
<script src="__JS__/layui/layui.js"></script>
<script src="__JS__/common.js"></script>
<script>
    var max_image_num = {$img_rule.max_image_num};
    var min_image_num = {$img_rule.min_image_num};
    var priue = UE.getEditor("editor",{toolbars: [
            ['fullscreen', 'source', 'undo', 'redo', 'bold']
        ]});

    //layui表单
    layui.use('form', function(){
        var form = layui.form;
    });

    //选择图片生成base64格式预览
    $(document).on("change",".add-player-upload-btn input[type=file]",function () {
        //校验图片数量
        var img_length = $(".upimage").length  + $(this)[0].files.length;
        if(img_length > max_image_num){
            layer.msg("图片最多不可超过"+max_image_num+"张");
            return false;
        }
        //图像转Base64
        imgBase64($(this)[0], function (imgString) {
            $.post("/admin/system/base64Image", {"imgString": imgString}, function (con) {
                $(".cloud-set-loading").hide();
                con = $.parseJSON(con);
                if (con.state == 1) {
                    var str =  '<div class="add-player-img-list">\n' +
                        '                    <div class="add-player-img">\n' +
                        '                        <img src="'+con.url+'" alt="">\n' +
                        '<input class="upimage" name="image_url[]" value="'+con.url+'" type="hidden">'+
                        '<input name="image_type[]" value="'+con.type+'" type="hidden">'+
                        '                    </div>\n' +
                        '                    <div class="add-player-img-del lcg-btn5">删除</div>\n' +
                        '                </div>';
                    $(".add-player-container").append(str).show();
                } else {
                    layer.msg(con.state);
                }
            }, 'json');
        });
    });

    $(document).on("click",".add-player-img-del",function(){
        $(this).parents(".add-player-img-list").remove();
    });
    //提交前校验
    function fun() {
        //校验图片数量
        var img_length = $(".upimage").length;
        if(img_length > max_image_num){
            layer.msg("图片最多不可超过"+max_image_num+"张");
            return false;
        }
        if(img_length < min_image_num){
            layer.msg("图片最少不可少于"+min_image_num+"张");
            return false;
        }
        return true;
    }
</script>
</html>